<template>
  <avue-select
    v-model="text"
    :dic="dic"
    :props="props"
    :placeholder="placeholder"
    :disabled="disabled">
  </avue-select>
</template>

<script>
  export default {
    name: 'TicketSelect',
    inject: {
      formSafe: { default: null }
    },
    data() {
      return {
        text: undefined
      }
    },
    props: {
      value: String,
      ticketAmountKey: String,
      ticketCountKey: String,
      valueKey: String,
      unitKey: String,
      row: Object,
      dic: {
        type: Array,
        default: ()=>[]
      },
      props: {
        type: Object,
        default: ()=>{
          return {
            label: 'subName',
            value: 'subEnName',
          }
        }
      },
      placeholder: String,
	    disabled: Boolean
    },
    watch: {
      value: {
        handler(val){
          this.text = val
        },
        immediate: true
      },
      text: {
        handler (val) {
          this.$emit('input', val)
          this.handleTicketNameChange(val);
        },
        immediate: true
      }
    },
    methods:{
      handleTicketNameChange(value){
        if(!value){
          this.setFormValue(this.ticketAmountKey, undefined)
          this.setFormValue(this.valueKey, undefined)
          return
        }
        for(let d of this.dic){
          if(d.subEnName == value){
            this.setFormValue(this.ticketAmountKey, d.ticketAmount)
            let value = d.ticketAmount
            this.setFormValue(this.valueKey, value)
            break
          }
        }
      },
      setFormValue(key, value){
        if(key){
          value = value == null? undefined : value
          if(this.row){
            this.$set(this.row, key, value)
          }else if(this.formSafe){
            this.formSafe.value[key] = value
          }
        }
      }
    }
  }
</script>

<style>
</style>
